﻿{extend name="public:base" /}{block name="css"}
<link href="/static/laydate/theme/default/laydate.css">
{/block}
{block name="content"}
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-lg-12">
            <div class="ibox ">
                <div class="ibox-title">
                    <a href="{:url('doShop')}" class="btn btn-primary btn-lg">新增</a>
                    <a href="{:url('updateAllShopQr')}" class="btn btn-primary btn-lg ajax-operate">一键更新推广码</a>

                    <div class="ibox-tools">
                        <a class="collapse-link">
                            <i class="iconfont icon-chevron-up"></i>
                        </a>
                    </div>
                </div>
                <div class="ibox-content">
                    {if $user_type == 0 || $user_type == 2}
                    <div class="row search-form">
                        {if $user_type == 0}
                        <div class="col-sm-2 m-b-sm">
                            <select class="form-control" name="up_company_user_id" id="companySelect">
                                <option value="0">请选择分公司/运营中心</option>
                                {volist name="company_list" id="vo"}
                                <option value="{$vo.id}" {:input('up_company_user_id') == $vo.id ? 'selected' : ''}>{$vo.username}</option>
                                {/volist}
                            </select>
                        </div>

                        <div class="col-sm-2 m-b-sm">
                            <select class="form-control" name="up_channel_user_id" id="channelSelect">
                                <option value="0">请选择渠道/团队长</option>
                            </select>
                        </div>
                        {/if}
                        {if $user_type == 2}
                        <div class="col-sm-2 m-b-sm">
                            <select class="form-control" name="up_channel_user_id">
                                <option value="0">请选择渠道/团队长</option>
                                {volist name="channel_list" id="vo"}
                                <option value="{$vo.id}" {$vo.id == input('up_channel_user_id') ? 'selected' : ''}>{$vo.username}</option>
                                {/volist}
                            </select>
                        </div>
                        {/if}

                        <div class="col-sm-2 m-b-sm">
                            <div class="input-group" style="width: 100%; display: flex; justify-content: space-between">
                                <button type="button" class="btn btn-primary btn-lg screen-btn">搜索</button>
                            </div>
                        </div>
                    </div>
                    {/if}

                    <div class="table-responsive">
                        <table class="table table-striped">
                            <thead>
                            <tr>
                                <th>ID</th>
                                <th>名称</th>
                                <th>账号</th>
                                <th class="mobile-hide">所属分公司/运营中心</th>
                                <th class="mobile-hide">所属渠道/团队长</th>
                                <th>推广码</th>
                                <th>操作</th>
                            </tr>
                            </thead>
                            <tbody>
                            {volist name="list" id="vo"}
                            <tr>
                                <td>{$vo.id}</td>
                                <td>{$vo.username}</td>
                                <td>{$vo.account}</td>
                                <td class="mobile-hide">{$vo.up_company_user_id|getUsername}</td>
                                <td class="mobile-hide">{$vo.up_channel_user_id|getUsername}</td>
                                <td>
                                    {if $vo.shop_qr}
                                    <div class="form-uploaded-img-box">
                                        <img class="form-uploaded-box-img" src="{$vo.shop_qr}">
                                        <i class="form-uploaded-img-preview iconfont icon-yulan" onclick="previewImg(this, 'form-uploaded-img-preview')"></i>
                                    </div>
                                    {/if}
                                </td>
                                <td class="project-actions">
                                    <a href="{:url(initPwd, ['id' => $vo.id])}" data-msg="您确认重置密码为123456吗？" class="btn btn-white btn-sm ajax-operate"><i class="iconfont icon-zhongxinhuida"></i> 重置密码 </a>
                                    <a href="{:url(doShop, ['id' => $vo.id])}" class="btn btn-white btn-sm"><i class="iconfont icon-edit"></i> 编辑 </a>
                                </td>
                            </tr>
                            {/volist}
                            </tbody>
                        </table>
                        {if !empty($list)}{$list->render()}{/if}
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>
{include file="public/preview-img-mask" swiper-id="cropper-preview" /}
{/block}

{block name="js"}
<script src="/static/laydate/laydate.js"></script>
<script>
    // 检测是否是手机端
    var isMobile = /Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent);
    if (isMobile) {
        $('.mobile-hide').hide();
    }else{
        $('.mobile-hide').show();
    }

    laydate.render({
        elem: '.screen-date', //指定元素
        format: 'yyyy-MM-dd',
        range: true
    });
    
    $(function() {
        // 公司渠道数据
        var company_list_json = `{$company_list_json}` ? JSON.parse(`{$company_list_json}`) : [];
        console.log(company_list_json)
        
        // 初始化时，如果有选中的公司，加载对应的渠道
        var initialCompanyId = $('#companySelect').val();
        if (initialCompanyId && initialCompanyId > 0) {
            loadChannels(initialCompanyId);
        }
        
        // 监听公司选择变化
        $('#companySelect').change(function() {
            var companyId = $(this).val();
            loadChannels(companyId);
        });
        
        // 根据公司ID加载渠道数据
        function loadChannels(companyId) {
            var channelSelect = $('#channelSelect');
            
            // 清空渠道下拉框
            channelSelect.empty().append('<option value="0">请选择渠道/团队长</option>');
            
            // 如果选择了有效的公司ID
            if (companyId > 0) {
                // 查找对应的公司
                var company = company_list_json.find(function(item) {
                    return item.id == companyId;
                });
                
                // 如果找到公司且有渠道列表
                if (company && company.channel_list && company.channel_list.length > 0) {
                    // 添加渠道选项
                    var up_channel_user_id = `{:input('up_channel_user_id')}`
                    company.channel_list.forEach(function(channel) {
                        var selected = up_channel_user_id == channel.id ? 'selected' : '';
                        var option = $('<option '+ selected +'></option>')
                            .val(channel.id)
                            .text(channel.username);
                        
                        channelSelect.append(option);
                    });
                }
            }
        }
    });
</script>{/block}

